<!DOCTYPE html>
<html>
<head>
 <title>Login</title>
 <style>
   body {
     font-family:Arial,sansserif;
     background-color:#f4f4f4;
     padding: 20px;
   }
   .container {
   max-width: 400px;
   margin:0 auto;
   background-color: #fff;
   padding: 20px;
   border-radius:5px;
   box-shadow:0010pxrgba(0,0,0,0.1);
}
h2 {
  text-align:center;
  margin-bottom:20px;
}

  .form-group {
  margin-bottom:15px;
}

  .form-group label {
  display: block;
  font-weight: bold;
  margin-bottom:5px;
}

  .form-group input {
    width: 100%;
    padding: 8px;
    border-radius:4px;
    border:lpx solid #ccc;
}
  .form-group input[type="submit"]{
    background-color:#4CAF50;
  color: #fff;
  cursor:pointer;
}

  .form-group input[type="submit"]:hover {
  background-color:#45a049;
}

  .error {
  color: red;
  font-weight: bold;
  margin-top:5px;
}

 </style>
</head>
<body>
 <div class="container">
    <h2>Login</h2>
    <form>
     <div class="form-group">
        <label for="username">Username:</label>
        <input type="text" id="username" name="username"required>
    </div>
    <div class="form-group">
        <label for="password">Password:</label>
        <input type="password" id="password" name="password" required>
    </div>
    <div class="form-group">
        <input type="submit"value="Login">
    </div>
  </form>
 </div>
</body>
</html>


